<script setup>
import{ref,reactive,getCurrentInstance,onMounted,toRef} from 'vue'
let {proxy}=getCurrentInstance()
let bt=ref(111)
let mz=ref(444)
let f1=reactive({})
let isshow=ref(false)
let url=ref("")
function imgchange(e){
    console.log(e.target.files[0],1111111111)
    f1=e.target.files[0]
    console.log(f1)
    url.value=window.URL.createObjectURL(f1)
    isshow.value=true
}

// function fn(){
//     console.log(f1)

//     xw.value=333
// }
// // console.log(111,f1,999999)
//     // console.log(f1)

// // onMounted(async()=>{
// //     let fdata=new FormData()
// //     fdata.append("img",img.files[0])

// //     let re=await proxy.$axios.post("",)
// // })
async function sub(){
    let fdata=new FormData()
    fdata.append("img",f1)
    fdata.append("title",bt.value)
    fdata.append("name",mz.value)
   let re=await proxy.$axios.post("/addgoods",fdata)
   if(re.data.code==200){
       alert("添加成功")
   }
}
async function sub1(){
    let fdata=new FormData()
    fdata.append("img",f1)
    fdata.append("title",bt.value)
    fdata.append("name",mz.value)
   let re=await proxy.$axios.post("/addgoods11",fdata)
   if(re.data.code==200){
       alert("添加成功")
   }
}
</script>

<template>

    <div>
   <h2>配图</h2>
    <label for="img" id="imgbox">
        <input type="file" name="img" id="img" @change="imgchange" >
    <img :src="url" class="minimg" v-show="isshow">

    </label>
    <h2>标题</h2>
    <label for="title" id="titlebox">
        <input type="text" name="title" id="title" v-model="bt" >
    </label>
    <h2>名字</h2>
    <label for="descri" id="describebox">
        <input type="text" name="descri" id="descri" v-model="mz">
    </label>

    <button @click="sub">提交新榜单</button>
    <button @click="sub1">提交专辑</button>

    </div>
    
</template>

<style scoped>
   *{
       margin: 0;
       padding: 0;
   }
 #imgbox{
            width: 200px;
            height: 200px;
            border: 1px gray dashed;
            display: block;
            background-size: 200px 200px;
            background-image: url("./img/111.jpeg");
        }
        #img{
display: none;            
        }
        .minimg{
            width: 200px;
            height: 200px;
        }

</style>
